<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>数字跳动动画</title>
  <style>
    body { font-family: sans-serif; text-align: center; margin-top: 100px; }
    .counter { font-size: 48px; color: #2196F3; }
  </style>
</head>
<body>
  <h1>📊 统计数据动画</h1>
  <div class="counter" id="number">0</div>

  <script>
    let target = 1000;
    let current = 0;

    const counter = document.getElementById("number");

    const interval = setInterval(() => {
      current += Math.ceil((target - current) / 20);
      counter.textContent = current;
      if (current >= target) {
        clearInterval(interval);
        counter.textContent = target;
      }
    }, 50);
  </script>
</body>
</html>
